import React, { Component } from 'react';
import './cview.css';
import $ from 'jquery';
 import {bindActionCreators} from 'redux';
// const store=createStore
import { updateMapData, doStartTimeOut ,updateIncreaseData,doIncreaseRefreshTime} from '../actions/doMapA';
import LimitedInfiniteScroll from 'react-limited-infinite-scroll'
import { connect } from 'react-redux';
import Header from "../component/Header";
import himg from "../img/timg.jpg";
const  list = [{name:'kkk'},{name:'kkk2'},{name:'kkk3'},{name:'kkk4'},{name:'kkk5'},{name:'kkk4'},{name:'kkk5'},{name:'kkk4'},{name:'kkk5'},{name:'kkk4'},{name:'kkk511'}]
const total=20;
const items = list.map((item, index) => {
    return (
        <div key={index}>
            <div className="main-list-item">{item.name}content</div>
        </div>
    )
})
class Main extends Component {
    constructor(props ) {
        super(props );
    }
    componentDidMount() {

    }



    componentDidUpdate() {

    }

    loadNextFunc() {
        console.log('pull')
       // this.props.dispatch(updateIncreaseData())
    }
    render() {
        //const {  onIncreaseClick } = this.props.onIncreaseClick;
        let nowData='11'
        if(this.props.series[0]){
            nowData=this.props.series[0].data
        }
        return (
            <div className="main">
                <Header rtitle="首页"/>
                <div className="main-img-div">
                 <img src={himg}/>
                </div>
                <div></div>
               <button onClick={this.props.onIncreaseClick}>数据 变化了</button>
                <button onClick={this.props.onSeriesClick}>series</button>
                <LimitedInfiniteScroll
                    limit={5}
                    hasMore={total === undefined || items.length < total}
                    spinLoader={<div className="loader">Loading...</div>}
                    mannualLoader={<span style={{fontSize: 20, lineHeight: 1.5, marginTop: 20, marginBottom: 20, display: 'inline-block'}}>Load More</span>}
                    noMore={<div className="loader">No More Items</div>}
                    loadNext={this.loadNextFunc}>
                    {items}
                </LimitedInfiniteScroll>
                <div className="height60"></div>
            </div>
        );
    }
}
const mapStateToProps = (state) => {
    return { config: state.config, series: state.series, time: state.time };
}
const mapDispatchToProps=(dispatch)=> {
    return {
        onIncreaseClick: bindActionCreators(doIncreaseRefreshTime,dispatch),
        onSeriesClick: bindActionCreators(updateIncreaseData,dispatch),
         ondeleyClick: bindActionCreators(doStartTimeOut,dispatch)
    }
}
Main = connect(mapStateToProps,mapDispatchToProps)(Main)
export default Main;